<template>
  <div class="handle-online">
    <div v-if="pageType === 'form'">
      <div class="notice_box">带*为必填项，请根据实际情况进行填写</div>
      <div>
        <van-cell required is-link title="服务类型" aria-disabled="true" v-model="objectTypeObj.name" @click="chooseObject" />
        <van-action-sheet v-model="objectShow" :actions="typeList" @select="confirmType" />
      </div>
      <div class="form-detail">
        <van-form v-if="formShow" :show-error-message="false" @submit="onSubmit" @failed="onFailed">
          <div v-if="objectTypeObj.type * 1 === 1">
            <div class="main_box_index">
              <span style="color: darkgray">详细信息</span>
            </div>
            <van-cell required is-link title="证件类型" aria-disabled="true" v-model="certificateObj.name" @click="certificateShow = true" />
            <van-action-sheet v-model="certificateShow" :actions="certificateList" @select="confirmCertificate" />
            <van-field
              v-if="certificateObj.code === '10'"
              required
              :rules="[{ required: true, message: '请填写证件编号' },
                {pattern: /(^[1-9]\d{5}(18|19|([23]\d))\d{2}((0[1-9])|(10|11|12))(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$)|(^[1-9]\d{5}\d{2}((0[1-9])|(10|11|12))(([0-2][1-9])|10|20|30|31)\d{2}$)/, message: '证件号码格式有误！', trigger: 'blur'}]"
              v-model="formData.idcardNo"
              name="idcardNo"
              label="证件编号"
              id="idcardNo"
              placeholder="请输入"
              input-align="right"
              @focus="inputFocus"
            />
            <van-field
              required
              v-if="certificateObj.code !== '10'"
              :rules="[{ required: true, message: '请填写证件号' }]"
              v-model="formData.idcardNo"
              name="idcardNo"
              label="证件号"
              id="idcardNo"
              placeholder="请输入"
              input-align="right"
              @focus="inputFocus"
            />
            <van-field
              required
              :rules="[{ required: true, message: '请填写当前用户姓名' }]"
              v-model="formData.name"
              name="name"
              label="当前用户姓名"
              id="name"
              placeholder="请输入"
              input-align="right"
              @focus="inputFocus"
            />
            <van-field
              required
              :rules="[{ required: true, message: '请填写联系电话'},
                {pattern: /^1[3-9]\d{9}$/, message: '请输入正确的手机号码！', trigger: 'blur'}]"
              v-model="formData.linkPhone"
              name="linkPhone"
              label="联系电话"
              id="linkPhone"
              placeholder="请输入"
              input-align="right"
              @focus="inputFocus"
            />
            <van-field
              required
              readonly
              is-link
              :rules="[{ required: true, message: '请选择性别' }]"
              v-model="sexObj.name"
              name="sex"
              label="性别"
              id="sex"
              placeholder="请选择"
              input-align="right"
              @click="sexShow = true"
            />
            <van-action-sheet v-model="sexShow" :actions="sexList" @select="confirmSex" />
            <van-field
              required
              :rules="[{ required: true, message: '请填写联系地址' }]"
              v-model="formData.linkAddress"
              name="linkAddress"
              label="联系地址"
              id="linkAddress"
              placeholder="请输入"
              input-align="right"
              @focus="inputFocus"
            />
            <van-field
              :rules="[{ message: '请填写邮箱' },
                {validator: checkEmail, message: '请输入正确的邮箱地址！', trigger: 'blur'}]"
              v-model="formData.email"
              name="email"
              label="邮箱"
              id="email"
              placeholder="请输入"
              input-align="right"
              @focus="inputFocus"
            />
            <!--pattern: /^[a-zA-Z0-9_-]+@([a-zA-Z0-9]+\.)+(com|cn|net|org)$/-->
            <van-field input-align="right" placeholder="请选择" :rules="[{ message: '请选择民族' }]" readonly is-link label="民族" name="ethnicity" id="ethnicity" v-model="ethnicityObj.name" @click="ethnicityShow = true" />
            <van-action-sheet v-model="ethnicityShow" :actions="ethnicityList" @select="confirmEthnicity" />
            <van-field
              readonly
              is-link
              :rules="[{ message: '请选择生日' }]"
              v-model="formData.birthdayStr"
              name="birthdayStr"
              label="生日"
              id="birthdayStr"
              input-align="right"
              @click="chooseBirthday"
            />
            <van-field placeholder="请选择" input-align="right" :rules="[{ message: '请选择学历' }]" readonly is-link label="学历" name="education" id="education" v-model="educationObj.name" @click="educationShow = true" />
            <van-action-sheet v-model="educationShow" :actions="educationList" @select="confirmEducation" />
            <van-field placeholder="请选择" input-align="right" :rules="[{ message: '请选择政治面貌' }]" readonly is-link label="政治面貌" name="politicalStatus" id="politicalStatus" v-model="politicalStatusObj.name" @click="politicalStatusShow = true" />
            <van-action-sheet v-model="politicalStatusShow" :actions="politicalStatusList" @select="confirmPoliticalStatus" />
            <van-field placeholder="请选择" input-align="right" :rules="[{ message: '请选择国家' }]" readonly is-link label="国家" name="country" id="country" v-model="countryObj.name" @click="countryShow =true" />
            <van-action-sheet v-model="countryShow" :actions="countryList" @select="confirmCountry" />
            <van-field placeholder="请选择" input-align="right" :rules="[{ message: '请选择省份' }]" readonly is-link label="省份" name="province" id="province" v-if="countryObj.code * 1 === 44" v-model="provinceObj.name" @click="provinceShow = true" />
            <van-action-sheet v-model="provinceShow" :actions="provinceList" @select="confirmProvince" />
            <van-field placeholder="请选择" input-align="right" :rules="[{ message: '请选择城市' }]" readonly is-link label="城市" name="city" id="city" v-if="countryObj.code * 1 === 44" v-model="cityObj.name" @click="cityShow = true" />
            <van-action-sheet v-model="cityShow" :actions="cityList" @select="confirmCity" />
            <van-field placeholder="请选择" input-align="right" :rules="[{ message: '请选择区县' }]" readonly is-link label="区县" name="county" id="county" v-if="countryObj.code * 1 === 44" v-model="countyObj.name" @click="countyShow = true" />
            <van-action-sheet v-model="countyShow" :actions="countyList" @select="confirmCounty" />
            <van-field
              :rules="[{ message: '请填写详细地址' }]"
              v-model="formData.homeAddress"
              name="homeAddress"
              label="详细地址"
              id="homeAddress"
              placeholder="请输入"
              input-align="right"
              @focus="inputFocus"
            />
            <van-field
              :rules="[{ message: '请填写邮编' },
                {validator: checkPostNum, message: '请输入正确的邮编！', trigger: 'blur'}]"
              v-model="formData.postCode"
              name="postCode"
              label="邮编"
              id="postCode"
              placeholder="请输入"
              input-align="right"
              @focus="inputFocus"
            />
          </div><!--个人-->
          <div v-if="objectTypeObj.type * 1 === 2">
            <van-field
              required
              :rules="[{ required: true, message: '请填写项目名称' }]"
              v-model="formData.projectName"
              name="projectName"
              label="项目名称"
              id="projectName"
              placeholder="请输入"
              input-align="right"
              @focus="inputFocus"
            />
            <van-field
              :rules="[{ message: '请填写项目编码' },
                {pattern: /^[0-9a-zA-Z]*$/, message: '请输入正确的项目编码！', trigger: 'blur'}]"
              v-model="formData.projectCode"
              name="projectCode"
              label="项目编码"
              id="projectCode"
              placeholder="请输入"
              input-align="right"
              @focus="inputFocus"
            />
            <van-field
              :rules="[{ message: '请填写项目审批核准备案文号' },
                {pattern: /^[0-9a-zA-Z]*$/, message: '请输入正确的项目审批核准备案文号！', trigger: 'blur'}]"
              v-model="formData.projectAllowedNo"
              name="projectAllowedNo"
              label="项目审批核准备案文号"
              id="projectAllowedNo"
              placeholder="请输入"
              input-align="right"
              @focus="inputFocus"
            />
            <van-field
              required
              :rules="[{ required: true, message: '请填写建设单位' }]"
              v-model="formData.contractor"
              name="contractor"
              label="建设单位"
              id="contractor"
              placeholder="请输入"
              input-align="right"
              @focus="inputFocus"
            />
            <van-field
              required
              :rules="[{ required: true, message: '请填写联系人' }]"
              v-model="formData.linkMan"
              name="linkMan"
              id="linkMan"
              label="联系人"
              placeholder="请输入"
              input-align="right"
              @focus="inputFocus"
            />
            <van-field
              required
              :rules="[{ required: true, message: '请填写联系电话' },
                {pattern: /^1[3-9]\d{9}$/, message: '请输入正确的手机号码！', trigger: 'blur'}]"
              v-model="formData.linkPhone"
              name="linkPhone"
              id="linkPhone"
              label="联系电话"
              placeholder="请输入"
              input-align="right"
              @focus="inputFocus"
            />
            <van-field
              :rules="[{ message: '请填写总投资（万元）' },
                {validator: checkNum, message: '请输入正确数字！', trigger: 'blur'}]"
              v-model="formData.investment"
              name="investment"
              id="investment"
              label="总投资（万元）"
              placeholder="请输入"
              input-align="right"
              @focus="inputFocus"
            />
            <!--pattern: /^[+]{0,1}(\d+)$|^[+]{0,1}(\d+\.\d+)$/-->
            <van-field
              :rules="[{ message: '请填写总用地面积（平方米）' },
                {validator: checkNum, message: '请输入正确数字！', trigger: 'blur'}]"
              v-model="formData.areaAll"
              name="areaAll"
              id="areaAll"
              label="总用地面积（平方米）"
              placeholder="请输入"
              input-align="right"
              @focus="inputFocus"
            />
            <van-field
              :rules="[{ message: '请填写建筑面积（平方米）' },
                {validator: checkNum, message: '请输入正确数字！', trigger: 'blur'}]"
              v-model="formData.areaBuild"
              name="areaBuild"
              id="areaBuild"
              label="建筑面积（平方米）"
              placeholder="请输入"
              input-align="right"
              @focus="inputFocus"
            />
            <van-field
              :rules="[{ message: '请填写项目地址' }]"
              v-model="formData.location"
              name="location"
              id="location"
              label="项目地址"
              placeholder="请输入"
              input-align="right"
              @focus="inputFocus"
            />
            <van-field
              :rules="[{ message: '请填写建设内容' }]"
              v-model="formData.projectContent"
              name="projectContent"
              id="projectContent"
              label="建设内容"
              placeholder="请输入"
              input-align="right"
              @focus="inputFocus"
            />
          </div><!--项目-->
          <div v-if="objectTypeObj.type * 1 === 3">
            <van-field
              required
              :rules="[{ required: true, message: '请填写组织机构名称' }]"
              v-model="formData.orgName"
              name="orgName"
              label="组织机构名称"
              id="orgName"
              placeholder="请输入"
              input-align="right"
              @focus="inputFocus"
            />
            <van-field
              required
              :rules="[{ required: true, message: '请填写统一信用社会代码' }]"
              v-model="formData.creditCode"
              name="creditCode"
              label="统一信用社会代码"
              id="creditCode"
              placeholder="请输入"
              input-align="right"
              @focus="inputFocus"
            />
            <van-field
              required
              :rules="[{ required: true, message: '请填写组织机构代码' },
                {pattern: /^[0-9a-zA-Z]*$/, message: '请输入正确的组织机构代码！', trigger: 'blur'}]"
              v-model="formData.orgCode"
              name="orgCode"
              label="组织机构代码"
              id="orgCode"
              placeholder="请输入"
              input-align="right"
              @focus="inputFocus"
            />
            <van-field
              readonly
              is-link
              v-model="formData.orgCodeAwardDateStr"
              name="orgCodeAwardDateStr"
              id="orgCodeAwardDateStr"
              label="组织机构代码发证日期"
              placeholder="请选择"
              input-align="right"
              @click="chooseSendDate"
            />
            <van-field
              v-model="formData.orgCodeAwardOrg"
              name="orgCodeAwardOrg"
              id="orgCodeAwardOrg"
              label="发证机构"
              placeholder="请输入"
              input-align="right"
              @focus="inputFocus"
            />
            <van-field
              readonly
              is-link
              v-model="formData.orgCodeValidPeriodStartStr"
              name="orgCodeValidPeriodStartStr"
              id="orgCodeValidPeriodStartStr"
              label="组织机构代码证有效期起"
              placeholder="请选择"
              input-align="right"
              @click="chooseStartDate"
            />
            <van-field
              readonly
              is-link
              v-model="formData.orgCodeValidPeriodEndStr"
              name="orgCodeValidPeriodEndStr"
              id="orgCodeValidPeriodEndStr"
              label="组织机构代码证有效期止"
              placeholder="请选择"
              input-align="right"
              @click="chooseEndDate"
            />
            <van-field
              v-model="formData.orgEnglishName"
              name="orgEnglishName"
              id="orgEnglishName"
              label="机构英文名称"
              placeholder="请输入"
              input-align="right"
              @focus="inputFocus"
            />
            <van-field placeholder="请选择" input-align="right" :rules="[{ message: '请选择组织机构类型' }]" readonly is-link label="组织机构类型" v-model="orgTypeObj.name" @click="orgTypeShow = true" />
            <van-action-sheet v-model="orgTypeShow" :actions="orgTypeList" @select="confirmOrgType" />
            <van-field
              required
              :rules="[{ required: true, message: '请填写组织机构现状' }]"
              v-model="formData.orgActuality"
              name="orgActuality"
              label="组织机构现状"
              id="orgActuality"
              placeholder="请输入"
              input-align="right"
              @focus="inputFocus"
            />
            <van-field
              v-model="formData.enterpriseSortCode"
              name="enterpriseSortCode"
              id="enterpriseSortCode"
              label="企业类别代码"
              placeholder="请输入"
              input-align="right"
              @focus="inputFocus"
            />
            <van-field
              v-model="formData.enterpriseSortName"
              name="enterpriseSortName"
              id="enterpriseSortName"
              label="企业类别名称"
              placeholder="请输入"
              input-align="right"
              @focus="inputFocus"
            />
            <van-field
              required
              :rules="[{ required: true, message: '请填写法定代表人' }]"
              v-model="formData.legalPerson"
              name="legalPerson"
              label="法定代表人"
              id="legalPerson"
              placeholder="请输入"
              input-align="right"
              @focus="inputFocus"
            />
            <van-field placeholder="请选择" input-align="right" :rules="[{ message: '请选择法定代表人类型' }]" readonly is-link label="法定代表人类型" v-model="personTypeObj.name" @click="personTypeShow = true" />
            <van-action-sheet duration="0.3" v-model="personTypeShow" :actions="personTypeList" @select="confirmPersonType" />
            <van-field
              required
              :rules="[{ required: true, message: '请填写法人证件名称' }]"
              v-model="formData.certificateName"
              name="certificateName"
              id="certificateName"
              label="法人证件名称"
              placeholder="请输入"
              input-align="right"
              @focus="inputFocus"
            />
            <van-field
              v-if="formData.certificateName === '身份证'"
              required
              :rules="[{ required: true, message: '请填写法人证件号码' },
                {pattern: /(^[1-9]\d{5}(18|19|([23]\d))\d{2}((0[1-9])|(10|11|12))(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$)|(^[1-9]\d{5}\d{2}((0[1-9])|(10|11|12))(([0-2][1-9])|10|20|30|31)\d{2}$)/, message: '证件号码格式有误！', trigger: 'blur'}
                ]"
              v-model="formData.certificateNo"
              name="certificateNo"
              id="certificateNo"
              label="法人证件号码"
              placeholder="请输入"
              input-align="right"
              @focus="inputFocus"
            />
            <van-field
              v-if="formData.certificateName !== '身份证'"
              required
              :rules="[{ required: true, message: '请填写法人证件号码' }]"
              v-model="formData.certificateNo"
              name="certificateNo"
              id="certificateNo"
              label="法人证件号码"
              placeholder="请输入"
              input-align="right"
              @focus="inputFocus"
            />
            <van-field
              required
              :rules="[{ required: true, message: '请填写联系电话' },
                {pattern: /^1[3-9]\d{9}$/, message: '请输入正确的手机号码！', trigger: 'blur'}]"
              v-model="formData.contactPhone"
              name="contactPhone"
              id="contactPhone"
              label="联系电话"
              placeholder="请输入"
              input-align="right"
              @focus="inputFocus"
            />
            <van-field
              required
              :rules="[{ required: true, message: '请填写联系人姓名' }]"
              v-model="formData.linkMan"
              name="linkMan"
              id="linkMan"
              label="联系人姓名"
              placeholder="请输入"
              input-align="right"
              @focus="inputFocus"
            />
            <van-field
              readonly
              is-link
              :rules="[{ message: '请选择登记注册日期' }]"
              v-model="formData.registerDateStr"
              name="registerDateStr"
              label="登记注册日期"
              id="registerDateStr"
              placeholder="请选择"
              input-align="right"
              @click="chooseRegDate"
            />
            <van-field
              :rules="[{ message: '请填写单位注册地址' }]"
              v-model="formData.registerAddress"
              name="registerAddress"
              id="registerAddress"
              label="单位注册地址"
              placeholder="请输入"
              input-align="right"
              type="textarea"
              autosize
              @focus="inputFocus"
            />
            <van-field
              :rules="[{ message: '请填写经营（生产）范围（主营）' }]"
              v-model="formData.businessScope"
              name="businessScope"
              id="businessScope"
              label="经营（生产）范围（主营）"
              placeholder="请输入"
              input-align="right"
              type="textarea"
              autosize
              @focus="inputFocus"
            />
          </div><!--企业-->
          <!--收件人信息-->
          <div class="main_box_index">
            <span style="color: darkgray">收件人信息</span>
          </div>
          <van-field placeholder="请选择" input-align="right" :rules="[{ required: true, message: '请选择结果领取方式' }]" required readonly is-link label="结果领取方式" v-model="jglqfsObj.name" @click="jglqfsShow = true" />
          <van-action-sheet v-model="jglqfsShow" :actions="jglqfsList" @select="confirmJglqfs" />
          <div v-if="jglqfsObj.code * 1 === 1">
            <van-field
              required
              :rules="[{ required: true, message: '请填写收件人姓名' }]"
              v-model="postObj.sjrxm"
              name="收件人姓名"
              label="收件人姓名"
              placeholder="请输入"
              input-align="right"
              @focus="inputFocus"
            />
            <van-field
              required
              :rules="[{ required: true, message: '请填写收件人电话' },
              {pattern: /^1[3-9]\d{9}$/, message: '请输入正确的手机号码！', trigger: 'blur'}]"
              v-model="postObj.sjrdh"
              name="收件人电话"
              label="收件人电话"
              placeholder="请输入"
              input-align="right"
              @focus="inputFocus"
            />
            <van-field
              :rules="[{ message: '请填写邮政编码' },
              {validator: checkPostNum, message: '请输入正确的邮编！', trigger: 'blur'}]"
              v-model="postObj.yzbm"
              name="邮政编码"
              label="邮政编码"
              placeholder="请输入"
              input-align="right"
              @focus="inputFocus"
            />
            <!--pattern: /^[0-9]{6}$/-->
            <van-field
              required
              :rules="[{ required: true, message: '请填写收件地址' }]"
              v-model="postObj.sjdz"
              name="收件地址"
              label="收件地址"
              placeholder="请输入"
              input-align="right"
              @focus="inputFocus"
            />
          </div>
          <div class="btn-content">
            <van-button block type="info" native-type="submit">
              确认并进入下一步
            </van-button>
          </div>
        </van-form>
      </div>
      <!--    生日弹窗-->
      <van-popup v-model="dateShow" position="bottom" :overlay="true">
        <van-datetime-picker
          type="date"
          title="选择年月日"
          @cancel="dateShow = false"
          @confirm="confirmDate"
          :min-date="minDate"
          :max-date="maxDate"
        />
      </van-popup>
    </div>
    <router-view />
  </div>
</template>
<script>
  import { apis } from '../../request/apis'
  const formTypeObj = {
    type1: {
      certificate: '',
      idcardNo: '',
      name: '',
      linkPhone: '',
      linkAddress: '',
      email: '',
      ethnicity: '',
      sex: '',
      birthdayStr: '',
      homeAddress: '',
      postCode: '',
      education: '',
      politicalStatus: '',
      country: '',
      province: '',
      city: '',
      county: '',
    },
    type2: {
      projectName: '',
      projectCode: '',
      projectAllowedNo: '',
      contractor: '',
      linkMan: '',
      linkPhone: '',
      investment: '',
      areaAll: '',
      areaBuild: '',
      location: '',
      projectContent: '',
    },
    type3: {
      orgName: '',
      creditCode: '',
      orgCode: '',
      orgCodeAwardDateStr: '',
      orgCodeAwardOrg: '',
      orgCodeValidPeriodStartStr: '',
      orgCodeValidPeriodEndStr: '',
      orgEnglishName: '',
      orgType: '',
      orgActuality: '',
      enterpriseSortCode: '',
      enterpriseSortName: '',
      legalPerson: '',
      legalPersonType: '',
      certificateName: '',
      certificateNo: '',
      contactPhone: '',
      linkMan: '',
      registerDateStr: '',
      registerAddress: '',
      businessScope: '',
    }
  };
  export default {
    name: 'HandleOnline',
    data(){
      return {
        userInfo: this.$store.state.userInfo,
        pageType: this.$route.query.pageType || 'form',
        itemBasicInfo: this.$tools.getSessionStorage('itemBasicInfo', {}),
        formId: null,
        formData: {},
        objectTypeObj: { // 用户类型
          type: '',
          name: ''
        },
        certificateObj: { // 证件
          code: '10',
          name: '身份证'
        },
        ethnicityObj: { // 民族
          code: '',
          name: ''
        },
        sexObj: { // 性别
          code: '',
          name: ''
        },
        educationObj: { // 学历
          code: '',
          name: ''
        },
        politicalStatusObj: { // 政治面貌
          code: '',
          name: ''
        },
        countryObj: { // 国家
          code: '',
          name: ''
        },
        provinceObj: { // 省
          code: '',
          name: ''
        },
        cityObj: { // 市
          code: '',
          name: ''
        },
        countyObj: { // 区县
          code: '',
          name: ''
        },
        jglqfsObj: { // 领取方式
          code: '',
          name: ''
        },
        orgTypeObj: { // 组织机构类型
          code: '',
          name: ''
        },
        personTypeObj: { // 法人类型
          code: '',
          name: ''
        },
        postObj: { // 邮寄信息
          sjrxm: '',
          sjrdh: '',
          yzbm: '',
          sjdz: ''
        },
        userType: this.$store.state.userType,
        formShow: false, // 用户类型
        objectShow: false, // 用户类型
        certificateShow: false, // 证件类型
        ethnicityShow: false, // 民族
        dateShow: false, // 时间
        sexShow: false, // 性别
        educationShow: false, // 学历
        politicalStatusShow: false, // 政治面貌
        countryShow: false, // 国家
        provinceShow: false, // 省
        cityShow: false, // 市
        countyShow: false, // 区县
        jglqfsShow: false, // 领取方式
        orgCodeAwardDateStrShow: false, // 组织机构代码发证日期
        orgTypeShow: false, // 组织机构类型
        personTypeShow: false, // 法人类型
        dateType: '',
        certificateList: [
          {
            name: '身份证',
            code: '10',
          },
          {
            name: '军官证',
            code: '11',
          },
          {
            name: '士兵证',
            code: '12',
          },
          {
            name: '警官证',
            code: '13',
          },{
            name: '港澳居民来往内地通行证',
            code: '14',
          },
          {
            name: '台湾居民来往大陆通行证',
            code: '15',
          },
          {
            name: '香港身份证',
            code: '16',
          },{
            name: '澳门身份证',
            code: '17',
          },{
            name: '台湾身份证',
            code: '18',
          },{
            name: '护照',
            code: '20',
          },{
            name: '其他证件',
            code: '40',
          },{
            name: '组织机构代码证',
            code: '50',
          },{
            name: '营业执照',
            code: '51',
          },{
            name: '事业单位登记证书',
            code: '52',
          },{
            name: '社团登记证书',
            code: '53',
          },{
            name: '民办非企业单位登记证书',
            code: '54',
          },{
            name: '工会法人资格证书',
            code: '55',
          },{
            name: '税务登记证',
            code: '60',
          },{
            name: '其他有效机构身份证件',
            code: '80',
          },{
            name: '无证件类型',
            code: '99',
          },
        ],
        typeList: [], // 用户类型
        sexList: [], // 性别
        educationList: [], // 学历
        politicalStatusList: [], // 政治面貌
        jglqfsList: [], // 领取方式
        personTypeList: [], // 法定代表人类型
        orgTypeList: [], // 组织机构类型
        countryList: [], // 国家
        ethnicityList: [], // 民族
        provinceList: [], // 省
        cityList: [], // 市
        countyList: [], // 区县
        maxDate: '',
        minDate: '',
      }
    },
    watch: {
      objectTypeObj: {
        immediate: false,
        deep: true,
        handler(val) {
          this.formShow = false;
          if (val.type) {
            sessionStorage.setItem('objectTypeCode', val.type);
            this.formData = { ...formTypeObj['type' + val.type] };
            this.setUserInfo();
          }
          this.$nextTick(() => {
            this.formShow = true;
          })
        }
      },
      $route() {
        this.pageType = this.$route.query.pageType || 'form';
      }
    },
    created(){
      this.getFormId();
      this.getObjectType();
      this.getSex();
      this.getEducation();
      this.getPoliticalStatus();
      this.getJglqfs();
      this.getpersonType();
      this.getOrgType();
      this.getNationality();
      this.getEthnicity();
      this.getProvince();
    },
    methods: {
      setUserInfo() {
        if (this.userInfo) {
          const { userInfo } = this;
          // const params = {
          //   userId: userInfo.uuid,
          // };
          // apis.requestGetUid(params).then((res) => {
          //   if (res.success) {
          //     console.log(res)
          //   }
          // });
          const { formData } = this;
          if (this.objectTypeObj.type * 1 === 1) {
            formData.idcardNo = formData.idcardNo || userInfo.papersnumber;
            formData.name = formData.name || userInfo.name;
            formData.linkPhone = formData.linkPhone || userInfo.mobile;
            formData.email = formData.email || userInfo.email;
            formData.linkAddress = formData.linkAddress || userInfo.address;
            let sexName = '男';
            if (!this.sexObj.code) {
              if (formData.idcardNo) {
                let reg = /(^[1-9]\d{5}(18|19|([23]\d))\d{2}((0[1-9])|(10|11|12))(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$)|(^[1-9]\d{5}\d{2}((0[1-9])|(10|11|12))(([0-2][1-9])|10|20|30|31)\d{2}$)/
                if (reg.test(formData.idcardNo)) {
                  const sexNum = formData.idcardNo.length > 15 ? formData.idcardNo[formData.idcardNo.length - 2] : formData.idcardNo[formData.idcardNo.length - 1];
                  if (!(sexNum % 2 > 0)) {
                    sexName = '女';
                  }
                }
              } else {
                if (userInfo.sex * 1 !== 1) {
                  sexName = '女';
                }
              }
              let sexObj = {};
              this.sexList.forEach((val) => {
                if (sexName === val.name) {
                  sexObj = val
                }
              });
              this.sexObj = sexObj;
            }
          }
          if (this.objectTypeObj.type * 1 === 3) {
            formData.orgName = formData.orgName || userInfo.corname;
            // formData.orgCode = formData.orgCode || userInfo.cornumber;
            formData.creditCode = formData.creditCode || userInfo.cornumber;
            formData.registerAddress = formData.registerAddress || userInfo.regaddress;
            formData.businessScope = formData.businessScope || userInfo.opscope;
            formData.legalPerson = formData.legalPerson || userInfo.corusername;
            formData.linkMan = formData.linkMan || userInfo.name;
            formData.contactPhone = formData.contactPhone || userInfo.mobile;
            formData.certificateNo = formData.certificateNo || userInfo.corusercardid;
            formData.certificateName = formData.certificateName || '身份证';
          }
          this.postObj = {
            sjrxm: this.postObj.sjrxm || userInfo.name,
            sjrdh: this.postObj.sjrdh || userInfo.mobile,
            yzbm: this.postObj.yzbm || '',
            sjdz: this.postObj.sjdz || userInfo.address
          };
          this.formData = formData
        }
      },
      setUserData() {

      },
      inputFocus(e) {
        this.windowScrollTo(e.target);
      },
      //获取formId
      async getFormId(){
        const params = {
          action: 'getFormInfo',
          pagemode: 'approval',
          itemId: this.itemBasicInfo.itemId
        };
        apis.requestGetFormInfo(params).then((res) => {
          if(res.success){
            this.formId = res.data.formId
          }
        })
      },
      checkObjectType(){
        if(this.itemBasicInfo.objecttype.includes('1') && this.userType * 1 === 1) {
          this.objectTypeObj = {
            name: '个人',
            type: '1'
          };
          return
        }
        if(this.itemBasicInfo.objecttype.includes('3') && this.userType * 1 === 2) {
          this.objectTypeObj = {
            name: '企业',
            type: '3'
          };
          return;
        }
        if(this.itemBasicInfo.objecttype === '2') {
          this.objectTypeObj = {
            name: '项目',
            type: '2'
          };
          return
        }
        if(this.userType * 1 === 2) {
          this.objectTypeObj = {
            name: '企业',
            type: '3'
          };
          return;
        }
        this.objectTypeObj = {
          name: '个人',
          type: '1'
        };
      },
      chooseObject() {
        this.objectShow = true;
        // const objectArr = this.itemBasicInfo.objecttype.split(',');
        // if (objectArr.length > 1) {
        // }
      },

      //获取服务类型
      async getObjectType(){
        apis.requestGetObjectType({}).then((res) => {
          if (res.success) {
            this.typeList = res.data.map(item=>{
              return{
                name: item.label,
                code: item.code
              }
            })
          }
        })
      },
      //获取性别
      async getSex(){
        apis.requestGetSex({}).then((res) => {
          if (res.success) {
            this.sexList = res.data.map(item=>{
              return{
                name: item.label,
                code: item.code
              }
            })
          }
          this.checkObjectType();
        })
      },
      //获取学历
      async getEducation(){
        apis.requestGetEducation({}).then((res) => {
          if(res.success){
            this.educationList = res.data.map(item=>{
              return{
                name: item.label,
                code: item.code
              }
            })
          }
        })
      },
      //获取政治面貌
      async getPoliticalStatus(){
        apis.requestGetPoliticalStatus({}).then((res) => {
          if(res.success){
            this.politicalStatusList = res.data.map(item=>{
              return{
                name: item.label,
                code: item.code
              }
            })
          }

        })
      },
      //获取领取方式
      async getJglqfs(){
        apis.requestGetJglqfs({}).then((res) => {
          if(res.success){
            this.jglqfsList = res.data.map(item=>{
              return{
                name: item.label,
                code: item.code
              }
            })
          }
        })
      },
      //获取法定代表人类型
      async getpersonType(){
        apis.requestGetLegalPersonType({}).then((res) => {
          if(res.success){
            this.personTypeList = res.data.map(item=>{
              return{
                name: item.label,
                code: item.code
              }
            })
          }
        })
      },
      //获取组织机构类型
      async getOrgType(){
        apis.requestGetOrgType({}).then((res) => {
          if(res.success){
            this.orgTypeList = res.data.map(item=>{
              return{
                name: item.label,
                code: item.code
              }
            })
          }
        })
      },
      //获取国家列表
      async getNationality(){
        apis.requestNationality({}).then((res) => {
          if(res.success){
            this.countryList = res.data.map(item=>{
              return{
                name: item.label,
                code: item.code
              }
            })
          }
        })
      },
      //获取民族列表
      async getEthnicity(){
        apis.requestEthnicity({}).then((res) => {
          if(res.success){
            this.ethnicityList = res.data.map(item=>{
              return{
                name: item.label,
                code: item.code
              }
            })
          }
        })
      },
      //获取省份列表
      async getProvince(){
        apis.requestGetProvince({}).then((res) => {
          if(res.success){
            this.provinceList = res.data.map(item=>{
              return{
                name: item.label,
                code: item.code,
              }
            })
          }
        })
      },
      //获取城市列表
      async getCity(code){
        const params = {
          id: code
        };
        apis.requestGetCity(params).then((res) => {
          if(res.success){
            this.cityList = res.data.map(item=>{
              return{
                name: item.label,
                code: item.code
              }
            })
          }
        })
      },
      //获取县区列表
      async getCounty(code){
        const params = {
          id: code
        };
        apis.requestGetArea(params).then((res) => {
          if(res.success){
            this.countyList = res.data.map(item=>{
              return{
                name: item.label,
                code: item.code
              }
            })
          }
        })
      },
      chooseBirthday () {
        this.dateType = 'birthday';
        this.minDate = new Date(1950,0,1);
        this.maxDate = new Date();
        this.dateShow = true
      },
      chooseSendDate () {
        this.dateType = 'sendDate';
        this.minDate = new Date(1990,0,1);
        this.maxDate = new Date();
        this.dateShow = true;
      },
      chooseStartDate () {
        this.dateType = 'startDate';
        this.minDate = new Date(1980,0,1);
        this.maxDate = new Date();
        this.dateShow = true;
      },
      chooseEndDate () {
        const now = new Date();
        this.dateType = 'endDate';
        this.minDate = new Date(1980,0,1);
        this.maxDate = new Date(now.getFullYear() + 30, now.getMonth(), now.getDate());
        this.dateShow = true;
      },
      chooseRegDate () {
        this.dateType = 'regDate';
        this.minDate = new Date(1980,0,1);
        this.maxDate = new Date();
        this.dateShow = true;
      },
      confirmType(item) {
        this.objectShow = false;
        const userType = this.userType * 1;
        const code = item.code * 1;
        if(code === 1){
          if (userType === 2) {
            this.$toast.fail('您登陆的用户类型是法人，禁止选择个人办件');
            return
          }
          this.objectTypeObj = {
            name: item.name,
            type: 1
          }
        }
        if (code === 2){
          this.objectTypeObj = {
            name: item.name,
            type: 2
          }
        }
        if (code === 3){
          if(userType === 1) {
            this.$toast.fail('您登陆的用户类型是个人，禁止选择企业办件');
            return
          }
          this.objectTypeObj = {
            name: item.name,
            type: 3
          }
        }
        this.setUserInfo();
      },
      confirmCertificate(data) {
        this.certificateObj = {
          code: data.code,
          name: data.name,
        };
        this.certificateShow = false
      },
      confirmEthnicity(data) {
        this.ethnicityObj = {
          code: data.code,
          name: data.name,
        };
        this.ethnicityShow = false
      },
      confirmSex(data) {
        this.sexObj = {
          code: data.code,
          name: data.name,
        };
        this.sexShow = false
      },
      confirmEducation(data) {
        this.educationObj = {
          code: data.code,
          name: data.name,
        };
        this.educationShow = false
      },
      confirmPoliticalStatus(data) {
        this.politicalStatusObj = {
          code: data.code,
          name: data.name,
        };
        this.politicalStatusShow = false
      },
      confirmCountry(data) {
        this.countryObj = {
          code: data.code,
          name: data.name,
        };
        this.countryShow = false
      },
      confirmProvince(data) {
        this.provinceObj = {
          code: data.code,
          name: data.name,
        };
        this.getCity(data.code);
        this.provinceShow = false
      },
      confirmCity(data) {
        this.cityObj = {
          code: data.code,
          name: data.name,
        };
        this.getCounty(data.code);
        this.cityShow = false
      },
      confirmCounty(data) {
        this.countyObj = {
          code: data.code,
          name: data.name,
        };
        this.countyShow = false
      },
      confirmJglqfs(data) {
        this.jglqfsObj = {
          code: data.code,
          name: data.name,
        };
        this.jglqfsShow = false
      },
      confirmOrgType(data) {
        this.orgTypeObj = {
          code: data.code,
          name: data.name,
        };
        this.orgTypeShow = false
      },
      confirmPersonType(data) {
        this.personTypeObj = {
          code: data.code,
          name: data.name,
        };
        this.personTypeShow = false
      },
      confirmDate(data) {
        console.log(data);
        let year = data.getFullYear();
        let month = data.getMonth() + 1;
        let day = data.getDate();
        if (this.dateType === 'birthday') {
          this.formData.birthdayStr = `${year}-${month}-${day}`;
        }
        if (this.dateType === 'sendDate') {
          this.formData.orgCodeAwardDateStr = `${year}-${month}-${day}`;
        }
        if (this.dateType === 'startDate') {
          this.formData.orgCodeValidPeriodStartStr = `${year}-${month}-${day}`;
        }
        if (this.dateType === 'endDate') {
          this.formData.orgCodeValidPeriodEndStr = `${year}-${month}-${day}`;
        }
        if (this.dateType === 'regDate') {
          this.formData.registerDateStr = `${year}-${month}-${day}`;
        }
        this.dateShow = false
      },
      onFailed(data) {
        const errMsg = data.errors[0].message;
        this.$toast.fail(errMsg);
        const ele = document.getElementById(data.errors[0].name);
        this.windowScrollTo(ele);
      },
      windowScrollTo(ele) {
        const nowHeight = window.pageYOffset;
        let domHeight = 0;
        if (ele) {
          domHeight = ele.getBoundingClientRect().top;
        }
        window.scrollTo({
          top: nowHeight * 1 + domHeight * 1,
          behavior: "smooth"
        });
      },
      onSubmit() {
        const params = {
          action: 'saveData',
          pagemode: 'serverV3P5',
          formId: this.formId,
        };
        const { postObj, formData } = this;
        if (this.objectTypeObj.type * 1 === 1) {
          formData.sex = this.sexObj.code;
          formData.ethnicity = this.ethnicityObj.code;
          formData.education = this.educationObj.code;
          formData.politicalStatus = this.politicalStatusObj.code;
          formData.country = this.countryObj.code;
          formData.province = this.provinceObj.code;
          formData.city = this.cityObj.code;
          formData.county = this.countyObj.code;
        }
        if (this.objectTypeObj.type * 1 === 3) {
          formData.legalPersonType = this.personTypeObj.code;
          formData.orgType = this.orgTypeObj.code;
        }
        postObj.code = this.jglqfsObj.code;
        sessionStorage.setItem('postObj', JSON.stringify(postObj));
        sessionStorage.setItem('formData', JSON.stringify(formData));
        apis.requestGetSaveData(params).then((res) => {
          if(res.success){
            this.$router.push({
              path: '/upload',
              query: {
                objectTypeCode: this.objectTypeObj.type,
                dataId: res.data.dataId,
                formId: this.formId,
                pageType: 'upload',
              }
            })
          }
        }).catch(() => {});
      },
      checkNum(val) {
        return new Promise((resolve) => {
          if (val) {
            resolve(/^[+]{0,1}(\d+)$|^[+]{0,1}(\d+\.\d+)$/.test(val));
          } else {
            resolve(true);
          }
        });
      },
      checkPostNum(val) {
        return new Promise((resolve) => {
          if (val) {
            resolve(/^[0-9]{6}$/.test(val));
          } else {
            resolve(true);
          }
        });
      },
      checkEmail(val) {
        return new Promise((resolve) => {
          if (val) {
            resolve(/^[a-zA-Z0-9_-]+@([a-zA-Z0-9]+\.)+(com|cn|net|org)$/.test(val));
          } else {
            resolve(true);
          }
        });
      }
    }
  }
</script>

<style lang="scss" scoped>
  .handle-online{
    padding-bottom: 76px;
    .btn-content{
      position: fixed;
      left: 0;
      right: 0;
      bottom: 0;
      padding: 16px;
      background-color: white;
    }
  }
  .notice_box{
    width: 100%;
    height: 30px;
    line-height: 30px;
    padding: 0 15px;
    font-size: 14px;
    background: #FCECED;
    color: #DF3C37;
  }
  .main_box_index {
    width: 100%;
    height: 30px;
    line-height: 30px;
    font-size: 14px;
    padding: 0 15px;
  }
  .van-field__error-message {
    color: #ee0a24;
    font-size: 0.75rem;
    text-align: right;
  }
  .uploader_box .van-cell__value{
    flex: 2 !important;
  }
  .van-cell__value {
    color: #323233;
  }
  .picker-content{
    position: relative;
    .holder{
      position: absolute;
      visibility: hidden;
    }
  }
</style>
